// 条件渲染
 
/**
 * 有一个type状态 1 2 3
 * 1--> h1
 * 2--> h2
 * 3--> h3
 * 原则：模板中的逻辑尽量保持精简
 * 复杂的多分支逻辑 收敛为一个函数 通过一个专门的函数来书写逻辑 模板中只负责调用即可
 * 
 */
const getType=(type)=>{
if(type ===1){
  return <h1>这是h1</h1>
}
if(type ===2){
  return <h2>这是h2</h2>
}
if(type ===3){
  return <h3>这是h3</h3>
}
}
function App() {
  return (
    <div className="App">
     {getType(1)}
     {getType(2)}
     {getType(3)}
    </div>
  );
}

export default App;
